<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<script type="text/javascript" src="../../zxt/zxt.js"></script>
		<script>importZXT("../../zxt");</script>
	</head>
    
	<body>
		<div id="Icon1" zxt="zxt.ui.Icon" zxt.image="../images/red.jpg" style="width:50px;height:50px"></div>
		<hr>
		<div id="Icon2" style="width:50px;height:50px"></div>
		<table>
			<tr>
				<td>getType()</td>
				<td>返回控件类型</td>
				<td><input type="button" name="getType" value="getType" 
					onclick="alert('图片按钮控件的type为'+$zxtUI.Icon1.getType());"/></td>
			</tr>
			<tr>
				<td>height(v)</td>
				<td>设置图片高度 和 获取图片高度</td>
				<td><input type="button" name="height" value="height" 
					onclick="alert('图片按钮控件的height为'+$zxtUI.Icon1.height());"/></td>
			</tr>
			<tr>
				<td>width(v)</td>
				<td>设置图片宽度 和 获取图片宽度</td>
				<td><input type="button" name="width" value="width" 
					onclick="alert('图片按钮控件的width为'+$zxtUI.Icon1.width());"/></td>
			</tr>
			<tr>
				<td>image(v)</td>
				<td>设置图片 和 获取图片</td>
				<td><input type="button" name="image" value="image" 
					onclick="alert('图片按钮控件的image为'+$zxtUI.Icon1.image());"/></td>
			</tr>
		</table>
		<div><a href="../index.html">返回</a></div>
	</body>
</html>

<script type="text/javascript">

	$zxt.init();
	var images = ["../images/black.jpg","../images/red.jpg"];
	var count = 0;
	
	function onClick$Icon1(){
		$zxtUI.Icon1.image(images[count%2]);
		count++;
		$zxtUI.Icon1.render();
	};

	var Icon = new zxt.ui.Icon();
	$zxt.register(Icon,"Icon2");
	Icon.image(images[0]);
	
	var count2 = 1;
	
	Icon.clickFunc(function(){
		$zxtUI.Icon2.image(images[count2%2]);
		count2++;
		$zxtUI.Icon2.render();
	});
	$("#Icon2").append(Icon.render());

</script>
